<?php 	
	// enable PHP session
	session_start();
	include_once("db.php");
	
	if ( isset($_REQUEST['Login']) )
	{	
		$dbObj = new db();
		$validUser = $dbObj->validateUser($_REQUEST['email']);
		if ( $validUser ) 
		{
			$_SESSION['userEmail'] = $_REQUEST['email'];		
			// after login redirect to home page
			header("Location: index.php");
			
		}
		else 
			echo "<p style='color:red;'>Failed to login.</span</p>";			
	}	
?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>CP2010 MySql Exercise</title>
<link rel="stylesheet" type="text/css" href="style.css"/>

<script type="text/javascript">
function validateUserInput() {
	// check email address format
	var reg = /^[\w-]+(\.[\w-]+)*@([\w-]+\.)+[a-zA-Z]{2,7}$/;	
	if ( document.getElementById('email').value.length == 0 || !document.getElementById('email').value.match(reg) ) {
		document.getElementById('errorLogin').innerHTML = "Please input a valid email address";
		return false;
	}
}
</script>

</head>

<body class="twoColElsLtHdr">

<div id="container">
  <div id="header">
    <h1>address Book</h1>
  <!-- end #header --></div>
  <div id="sidebar1">
    <h3><a href="index.php">Home</a></h3>    
    <h3><a href="addAddress.php">Add</a></h3>
    <h3><a href="deleteAddress.php">Delete</a></h3>
    <h3><a href="modifyAddress.php">Modify</a></h3>    
  <!-- end #sidebar1 --></div>
  <div id="mainContent">
    <h2 align="center">Login</h2>
    <form action="login.php" method="post" onsubmit="return validateUserInput()">
      <table border="0" align="center" cellpadding="2" cellspacing="3">
        <tr >
          <td>Email address</td>
          <td><input type="text" name="email" id="email" /></td>
          <td align="center"><input type="submit" name="Login" value=" Login " /></td>
        </tr>
        <tr><td colspan="3"><label id="errorLogin" class="errorMessage"></label></td></tr>
      </table>
    </form>
    <!-- end #mainContent -->
  </div>
	<!-- This clearing element should immediately follow the #mainContent div in order to force the #container div to contain all child floats --><br class="clearfloat" />
   <div id="footer">
    <p>CP2010 MySql Exercise</p>
  <!-- end #footer --></div>
<!-- end #container --></div>
</body>
</html>